<!--
 * @Descripttion: 
 * @version: 
 * @Author: mmzhang
 * @Date: 2021-07-20 15:04:42
 * @LastEditTime: 2021-08-10 10:42:45
-->
<template>
  <div class="payment-msg">
    <p class="title">付款信息</p>
    <ul class="flex flex-wrap">
      <li class="flex" v-for="(item,index) in msgList" :key="index">
        <p class="text-right name">{{item.name}}：</p>
        <p v-if="item.unit==''">{{msgPay[item.key]}}{{item.unit}}</p>
        <p v-else>{{$tool.formatterMoney(msgPay[item.key])}}{{item.unit}}</p>
      </li>
    </ul>
  </div>
</template>
<script>
export default {
  props: ['detailMsg'],
  data() {
    return {
      msgList: [
        {
          name: '付款方式',
          key: 'payTypeCN',
          unit: '',
        },
        {
          name: '全款到账日期',
          key: 'predictAccountDate',
          unit: '',
        },
        {
          name: '首付金额',
          key: 'downPayment',
          unit: '元',
        },
        {
          name: '自有现金',
          key: 'ownCash',
          unit: '元',
        },
        {
          name: '贷款银行',
          key: 'loansBank',
          unit: '',
        },
        {
          name: '贷款金额',
          key: 'loansMoney',
          unit: '元',
        },
      ],
      msgPay: {},
    }
  },
  mounted() {
    this.msgPay = { ...this.detailMsg.orReturnedMoneyVO }
    this.msgPay.payTypeCN = this.$formatter.switchName(
      'payType',
      this.msgPay.payType
    )
  },
}
</script>
<style lang="scss"  scoped>
.payment-msg {
  margin-top: 40px;
  ul {
    li {
      width: 50%;
      line-height: 50px;
      .name {
        width: 150px;
      }
    }
  }
}
</style>